<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>计算器</title>
    <script src="../assets/yl.app.js"></script>
    <link rel="stylesheet" type="text/css" href="https://cdn.bootcss.com/bootstrap/4.0.0-beta/css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/htmleaf-demo.css">
    <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="htmleaf-container">
    <div>
        <div class="container">
            <!-- Rounded switch -->
            <label class="switch">
                <input type="checkbox">
                <span class="slider"></span>
            </label>
            <form>
                <input readonly id="display1" type="text" class="form-control-lg text-right">
                <input readonly id="display2" type="text" class="form-control-lg text-right">
            </form>

            <div class="d-flex justify-content-between button-row">
                <button id="left-parenthesis" type="button" class="operator-group">&#40;</button>
                <button id="right-parenthesis" type="button" class="operator-group">&#41;</button>
                <button id="square-root" type="button" class="operator-group">&#8730;</button>
                <button id="square" type="button" class="operator-group">&#120;&#178;</button>
            </div>

            <div class="d-flex justify-content-between button-row">
                <button id="clear" type="button">&#67;</button>
                <button id="backspace" type="button">&#9003;</button>
                <button id="ans" type="button" class="operand-group">&#65;&#110;&#115;</button>
                <button id="divide" type="button" class="operator-group">&#247;</button>
            </div>


            <div class="d-flex justify-content-between button-row">
                <button id="seven" type="button" class="operand-group">&#55;</button>
                <button id="eight" type="button" class="operand-group">&#56;</button>
                <button id="nine" type="button" class="operand-group">&#57;</button>
                <button id="multiply" type="button" class="operator-group">&#215;</button>
            </div>


            <div class="d-flex justify-content-between button-row">
                <button id="four" type="button" class="operand-group">&#52;</button>
                <button id="five" type="button" class="operand-group">&#53;</button>
                <button id="six" type="button" class="operand-group">&#54;</button>
                <button id="subtract" type="button" class="operator-group">&#8722;</button>
            </div>


            <div class="d-flex justify-content-between button-row">
                <button id="one" type="button" class="operand-group">&#49;</button>
                <button id="two" type="button" class="operand-group">&#50;</button>
                <button id="three" type="button" class="operand-group">&#51;</button>
                <button id="add" type="button" class="operator-group">&#43;</button>
            </div>

            <div class="d-flex justify-content-between button-row">
                <button id="percentage" type="button" class="operand-group">&#37;</button>
                <button id="zero" type="button" class="operand-group">&#48;</button>
                <button id="decimal" type="button" class="operand-group">&#46;</button>
                <button id="equal" type="button">&#61;</button>
            </div>
        </div>
    </div>
</div>

<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js" type="text/javascript"></script>
<script>window.jQuery || document.write('<script src="js/jquery-1.11.0.min.js"><\/script>');</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjs/3.17.0/math.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js"
        integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh"
        crossorigin="anonymous"></script>
<script type="text/javascript" src="https://cdn.bootcss.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script>
<script src="js/main.js" type="text/javascript"></script>
</body>
</html>
